<template>
  <div>
    <el-form
      ref="form"
      style="font-weight: 700"
      :model="form"
      label-width="80px"
      :rules="rules"
    >
      <el-form-item label="APP名字" prop="in_name">
        <el-input v-model="form.in_name" style="width: 500px"></el-input>
      </el-form-item>
      <el-form-item label="推广链接" prop="in_link">
        <div style="display: flex">
          <el-input
            disabled
            value="https://kb.eideas.cn/a/"
            style="width: 260px"
          ></el-input
          >+
          <el-input v-model="form.in_link" style="width: 233px"></el-input>
        </div>
      </el-form-item>
      <el-form-item label="下载密码">
        <el-input v-model="form.in_apppwd" style="width: 500px"></el-input>
      </el-form-item>
      <el-form-item label="联系方式" style="width: 581px">
        <el-input v-model="form.in_contact"></el-input>
      </el-form-item>
      <el-form-item label="下载限制" style="width: 581px">
        <el-input v-model="form.in_applimit"></el-input>
      </el-form-item>
      <el-form-item label="应用介绍" style="width: 581px">
        <el-input type="textarea" v-model="form.in_appintro"></el-input>
      </el-form-item>
      <el-form-item label="备注" style="width: 581px">
        <el-input type="textarea" v-model="form.in_remark"></el-input>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="onSubmit">保存</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
import { appEdit } from '@/api/App';

export default {
  props: ['list'],
  data() {
    return {
      form: {}, //数据
      rules: {
        in_name: [
          { required: true, message: '请输入APP名字', trigger: 'blur' },
          { min: 2, max: 8, message: '长度在 3 到 8 个字符', trigger: 'blur' }
        ],
        in_link: [
          {
            required: true,
            message: '请输入链接',
            trigger: 'blur'
          },
          {
            min: 2,
            max: 8,
            message: '长度在 2到 8 个字符',
            trigger: 'blur'
          },
          {
            pattern: /^[0-9a-zA-Z]+$/,
            message: '只能输入数字或英文大小写字符',
            trigger: 'blur'
          }
        ],
        in_apppwd: [
          {
            required: true,
            message: '请输入密码',
            trigger: 'blur'
          },
          {
            min: 8,
            max: 16,
            message: '长度在 8 到 16 个字符',
            trigger: 'blur'
          }
        ],
        in_appintro: [
          {
            required: true,
            message: '请输入应用介绍',
            trigger: 'blur'
          },
          {
            min: 2,
            message: '最少需两个字',
            trigger: 'blur'
          },
          {
            max: 201,
            message: '最多只能200个字',
            trigger: 'blur'
          }
        ],
        in_contact: [
          {
            required: true,
            message: '请输入联系方式',
            trigger: 'blur'
          },
          {
            pattern: /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,6}$/, // 简单的邮箱格式验证
            message: '请输入有效的邮箱地址',
            trigger: 'blur'
          }
        ],
        in_applimit: [
          {
            required: true,
            message: '下载限制次数',
            trigger: 'blur'
          },
          {
            pattern: /^[0-9]+$/,
            message: '请输入有效的数字',
            trigger: 'blur'
          }
        ],
        in_remark: [
          {
            required: true,
            message: '请输入备注',
            trigger: 'blur'
          },
          {
            min: 2,
            message: '最少需两个字',
            trigger: 'blur'
          },
          {
            max: 201,
            message: '最多只能200个字',
            trigger: 'blur'
          }
        ]
      }
    };
  },
  created() {
    this.form = JSON.parse(JSON.stringify(this.list));
  },
  watch: {
    list: {
      handler(vlue) {
        this.form = JSON.parse(JSON.stringify(this.list));
      },
      deep: true
    }
  },
  methods: {
    //保存
    onSubmit() {
      //删除多余
      delete this.form.in_uid;
      delete this.form.in_uname;
      delete this.form.in_icon;
      delete this.form.in_form;
      delete this.form.in_bid;
      delete this.form.in_mnvs;
      delete this.form.in_bsvs;
      delete this.form.in_bvs;
      delete this.form.in_type;
      delete this.form.in_nick;
      delete this.form.in_team;
      delete this.form.in_udids;
      delete this.form.in_app;
      delete this.form.in_originalName;
      delete this.form.in_downloads;
      delete this.form.in_deduct;
      delete this.form.in_size;
      delete this.form.in_tutorial;
      delete this.form.in_appstore;
      delete this.form.in_kid;
      delete this.form.in_sign;
      delete this.form.in_resign;
      delete this.form.in_package;
      delete this.form.in_cert_type;
      delete this.form.in_applock;
      delete this.form.in_addtime;
      delete this.form.in_updatetime;
      delete this.form.remote;
      delete this.form.in_bexe;
      delete this.form.in_super;
      delete this.form.in_super_device_num;
      delete this.form.in_super_num;
      delete this.form.in_private;
      delete this.form.in_use_auth_code;
      delete this.form.auth_code_dispense_url;
      delete this.form.clear_time;
      delete this.form.in_steal_on;
      delete this.form.in_sign_type;
      this.$refs.form.validate(async (valid) => {
        if (valid) {
          await appEdit({
            ...this.form
          });
          this.$message.success('保存成功');
          window.location.reload();
        } else {
          this.$message.info('保存失败');
        }
      });
    }
  }
};
</script>

<style scoped>
.DownloadTemplate {
  border: 1px solid #eee;
  margin-right: 20px;
}
</style>
